Vite 環境安裝教學

要開始用 Vite 開發專案之前，第一步當然是把環境裝起來。別擔心，流程比你想像的簡單很多。

🔹 第一步：安裝 Node.js

Vite 需要 Node.js 來執行，所以先到 Node.js 官網
下載 LTS 版本（比較穩定）。
安裝好後，可以打開終端機（Mac 用 Terminal、Windows 用 PowerShell）輸入：

node -v
npm -v

如果有看到版本號，代表安裝成功。

🔹 第二步：建立 Vite 專案

在終端機輸入：

npm create vite@latest my-app

這行指令意思是「用最新版本的 Vite 建立一個叫做 my-app 的專案」。
接著 Vite 會問你：

1.專案名稱？（預設就是 my-app）

2.要用哪種框架？（Vue、React、Svelte… 或選 Vanilla 就是純 JS）

3.是否要加 TypeScript？

舉例：如果你選 React + TypeScript，Vite 就會幫你把環境配好。

🔹 第三步：安裝依賴

進入專案資料夾，執行：

cd my-app
npm install

這一步會下載所有需要的套件，讓你的專案能順利跑起來。

🔹 第四步：啟動開發伺服器

最後，輸入：

npm run dev

終端機會出現類似：

  Local:   http://localhost:5173/

🔹 錯誤排查小技巧

如果安裝過程出錯，常見解法：

node -v 出不來 → 代表 Node.js 沒裝好，重新安裝。

npm install 卡住 → 試著刪掉 node_modules，再跑一次。

npm run dev 開不起來 → 檢查 5173 這個 port 是否被佔用，可以換 port：

npm run dev -- --port=3000

小結

安裝 Vite 環境的步驟很簡單：

1.安裝 Node.js

2.建立 Vite 專案

3.安裝依賴

4.啟動開發伺服器

照著這四步，你就能從零開始跑起一個 Vite 專案